<!-- 高压用户退役页面弹窗 -->
<template>
  <div>
    <el-dialog :title="tyTitle" :visible.sync="visible" :close-on-click-modal="false" width="400px" top="8vh" v-dialogDrag @close="cancel()">
      <el-form :model="tyForm" size="small" :rules="FormRules" ref="tyForm" label-width="100px">
        <el-row>
          <el-col :span="22">
            <el-form-item label="用户编码" prop="yhbm">
              <el-input v-model="tyForm.yhbm" disabled></el-input>
            </el-form-item>

            <el-form-item label="用户名称" prop="yhmc">
              <el-input v-model="tyForm.yhmc" disabled></el-input>
            </el-form-item>

            <el-form-item label="退役日期" prop="tcrq">
              <el-date-picker type="date" v-model="tyForm.tcrq" value-format="yyyy-MM-dd" style="width:100%"></el-date-picker>
            </el-form-item>

            <el-form-item label="退役原因" prop="yhms">
              <el-input v-model="tyForm.yhms"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <div slot="footer" class="foot-container">
        <el-button type="primary" size="mini" @click="ty('tyForm')">确 定</el-button>
        <el-button type="primary" size="mini" @click="cancel()">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { compareDate } from "@/utils/validate";
  import { retireZcgyyhsj } from "@/api/sjwh/zcgy";
  import { getUserInfo } from "@/utils/utilInfo.js";

  export default {
    name: 'zcgyyhTy',
    props: ['rowData'],  // 父页面传参
    data() {
      return {
        tyTitle:'高压用户退役',
        visible: false,
        tyForm: {
          id: '',
          yhbm: '',
          yhmc: '',
          zcrq: '',
          tcrq: '',
          czy: getUserInfo.userName,
        },
        FormRules: {
          tcrq: [{required: true, message: '请选择退役日期', trigger: 'blur'}],
        },
      }
    },

    created() {
    },

    mounted() {
    },

    methods: {
      open() {
        this.visible = true;
        this.tyForm.id = this.rowData.id;
        this.tyForm.yhbm = this.rowData.yhbm;
        this.tyForm.yhmc = this.rowData.yhmc;
        this.tyForm.zcrq = this.rowData.zcrq;
      },
      ty() {
        this.$refs['tyForm'].validate((valid) => {
          if(valid) {
            if(compareDate(this.tyForm.zcrq,this.tyForm.tcrq)){
              this.$message.warning("退役日期不能早于注册日期！");
              return;
            }
            // 提交数据
            retireZcgyyhsj(this.tyForm).then(res => {
              if (res.code == 0) {
                this.$message.success( "操作成功！");
                this.cancel();
                this.$parent.refresh(); // 调用父页面方法
              } else {
                this.$message.error("操作失败！");
              }
            });
          }else{
            this.$message.warning( "请检查填写数据项是否缺失或错误！");
          }
        });
      },
      cancel() {
        const that = this;
        that.visible = false;
        that.$refs['tyForm'].resetFields();  // 重置表单
        that.tyForm.zcrq = '';
        that.tyForm.id = '';
      },
    }
  }
</script>

<style scoped lang='scss'>
  /deep/ .el-dialog__body {
    padding-top: 20px;
    padding-bottom: 1px;
    border-top: 1px solid #e8eaec;
    border-bottom: 1px solid #e8eaec;
  }
  /deep/ .el-dialog__header {
    padding: 10px 10px 10px;
  }
  /deep/ .el-dialog__footer {
    padding: 10px 10px 10px;
  }
  .dialog-container{
    height: 100%;
    overflow: auto;
  }
</style>
